<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>个人信息</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/mess.css" />
		<link rel="stylesheet" type="text/css" href="css/mui.picker.css" />
		<link rel="stylesheet" type="text/css" href="css/mui.poppicker.css" />
		<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/mui.picker.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.poppicker.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/city.data.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body style="background: #fff;">
		<header class="mui-bar mui-bar-nav">
			<div style="height: 20px;"></div>
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">完善个人信息</h1>
		</header>
		<div class="mui-content" style="padding-top: 64px;">
			<div class="mainTitle">
				<p>
					请填写真实有效的信息，以便快速通过认证
				</p>
			</div>
			<div class="mainColor">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-input-row">
						<label>真实姓名</label>
						<input type="text" class="info_name" placeholder="请输入您的姓名">
					</li>
					<li class="mui-table-view-cell mui-input-row mui-content" style="position:relative">
						<label>所在地区</label>
						<input id='showCityPicker3' type="text" class="info_place" placeholder="省——市——区" readonly="readonly">
						<!-- <div class="mui-content-padded">
							<button class="mui-btn mui-btn-block" type='button'>省——市——区</button>
						</div> -->
					</li>
					<li class="mui-table-view-cell mui-input-row">
						<label>详细地址</label>
						<input type="text" class="info_address" placeholder="请输入街道号及门牌号">
					</li>
				</ul>
				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-input-row">
						<label>身份证号</label>
						<input type="text" class="info_id" placeholder="请输入您的证件号码">
					</li>
					<li class="mui-table-view-cell mui-input-row">
						<label>邮箱地址</label>
						<input type="text" class="info_email" placeholder="请输入您的邮箱地址">
					</li>
					<li class="mui-table-view-cell mui-input-row" style="position:relative">

						<label>验证邮箱</label>
						<input type="text" class="info_code" placeholder="请输入验证码">
						<div class="mesM">
							<input class="ym password_getcode" readonly="readonly" type="text" value="获取验证码">
						</div>
					</li>
				</ul>
				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-input-row">
						<label>所在单位</label>
						<input type="text" class="info_company" placeholder="请输入您所在单位">
					</li>
					<li class="mui-table-view-cell mui-input-row">
						<label>职<b class="post"></b>务</label>
						<input type="text" class="info_post" placeholder="请输入您的职务">
					</li>
				</ul>
				<div class="mainButton">
					<button type="button" class="mui-btn mui-btn-blue password_btn">确定</button>
				</div>
			</div>

		</div>
		<!-- 弹出层 -->
		<div class="meMark">
			<div class="mark"></div>
			<div class="messImg">
				<img src="images/t_03.png" alt="">
			</div>
		</div>

		<script type="text/javascript">
			mui.init();
			var _url = 'http://112.54.80.235:8038';
			mui.plusReady(function() {
				//关闭等待框
				plus.nativeUI.closeWaiting();
				var self = plus.webview.currentWebview();
				var phone = self.phone; //获得参数
				var password = self.password;
				console.info(password);
				console.info(JSON.stringify(self));
				var _getParam = function(obj, param) {
					return obj[param] || '';
				};
				//级联示例
				var cityPicker3 = new mui.PopPicker({
					layer: 3
				});
				cityPicker3.setData(cityData3);
				var showCityPickerButton = document.getElementById('showCityPicker3');
				showCityPickerButton.addEventListener('tap', function(event) {
					$('input').blur()
					cityPicker3.show(function(items) {
						showCityPickerButton.value = _getParam(items[0], 'text') + " " + _getParam(items[1], 'text') + " " +
							_getParam(items[2], 'text');
						//返回 false 可以阻止选择框的关闭
						//return false;
					});
				}, false);
				/* 弹出层 */
				$('.meMark .messImg img').on('tap', function() {
					$('.meMark').css('display', 'none')
				})
				//点击登录
				$(".meMark").on('tap', function() {
					mui.openWindow({
						url: "login.html",
						id: "login.html",
						waiting: {
							autoShow: true, //自动显示等待框，默认为true
							title: '正在加载...', //等待对话框上显示的提示内容
						}
					});
				})

				//判断证件号
				// mui(".info_id")[0].onblur = function() {
				// 	var info_id = mui(".info_id")[0].value;
				// 	//var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
				// 	var pattern = /^(\d{15}$|^\d{18}$|^\d{17}(\d|X|x))$/;
				// 	if (!pattern.test(info_id)) {
				// 		mui.toast('请输入正确的身份证号');
				// 		return false;
				// 	};
				// };
				//点击确认按钮
				mui('.password_btn')[0].addEventListener('tap', function() {
					var info_name = mui(".info_name")[0].value; //名字
					var info_id = mui(".info_id")[0].value; //证件号码
					var info_company = mui(".info_company")[0].value; //单位
					var info_post = mui(".info_post")[0].value; //职务
					var info_place = mui(".info_place")[0].value; //地区
					var info_address = mui(".info_address")[0].value; //地址 
					var info_email = mui(".info_email")[0].value; //邮箱地址
					var info_code = mui(".info_code")[0].value; //验证邮箱
					var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
					var reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
					console.log("s--"+info_id);
					console.log(!pattern.test(info_id));
					//姓名
					if (info_name.length == 0) {
						mui.toast('请输入真实姓名');
					} else if (info_place.length == 0) {
						mui.toast('请选择所在地区');
					} else if (info_address.length == 0) {
						mui.toast('请输入详细地址');
					} else if (!pattern.test(info_id)) {
						mui.toast('请输入正确的身份证号');
					} else if (!reg.test(info_email)) {
						mui.toast('请输入正确的邮箱地址');
					} else if (info_company.length == 0) {
						mui.toast('请输入所在单位')
					} else if (info_post.length == 0) {
						mui.toast('请输入职务')
					} else {
						//验证邮箱
						$.ajax({
							url: _url + '/actionapi/Users/GetYanZhengMa',
							type: "post",
							data: JSON.stringify({
								phone: info_email,
								code: info_code
							}),
							dataType: 'json',
							contentType: "application/json; charset=utf-8",
							timeout: 5000,
							error: function(xhr, type, errorThrown) {
								mui.toast('GetYanZhengMa接口链接失败');
								return false;
							},
							success: function(data) { //回调函数，result，返回值

								if (data.code == "1") {
									//保存登录信息
									$.ajax({
										type: 'post',
										url: _url + '/actionapi/Users/YongHuZhuCe',
										dataType: 'json',
										contentType: "application/json; charset=utf-8",
										data: JSON.stringify({
											UserKey: 0,
											Mobile: phone,
											Password: password,
											UserName: info_name,
											Card: info_id,
											rolekey: 0,
											flag: 0,
											remark: "21212",
											Company: info_company,
											Duties: info_post,
											Area: info_place,
											Address: info_address,
											Email: info_email
										}),
										success: function(data) {
											if (data.code == 1) {
												//登录成功,显示弹窗
												$('.meMark').show();
											} else {
												mui.toast(data.message)
											}

										},
										error: function(XMLHttpRequest, textStatus, errorThrown) {}
									})
								} else {
									mui.toast(data.message);
									return false;
								}
							}
						});
					}
				});
				//点击获取验证码
				$('.ym').on('tap', function() {
					var time = 60;
					$('.ym').attr("disabled", true)
					var myVar = setInterval(function() {
						if (time > 1) {
							time--;
							mui('.ym')[0].value = time + "秒后重新获取"
						} else {
							clearInterval(myVar);
							$('.ym').attr("disabled", false)
							mui('.ym')[0].value = "获取验证码"
							//mui('.password_getcode')[0].removeAttribute('disabled');
						}
					}, 1000);
					var val = mui(".info_email")[0].value;
					var reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
					if (!reg.test(val)) {
						mui.toast('请输入正确的邮箱地址')
						return false;
					};
					//邮箱唯一性验证
					$.ajax({
						type: 'get',
						url: _url + '/actionapi/Users/CheckYouXiang',
						timeout: 5000,
						dataType: 'json',
						contentType: "application/json; charset=utf-8",
						data: {
							Email: val
						},
						success: function(data) {
							var ema = '"' + val + '"';
							console.log(ema);
							if (data.code == 1) {
								$.ajax({
									url: _url + '/actionapi/Users/YouXiangYanZheng',
									type: "post",
									data: ema,
									dataType: 'json',
									contentType: "application/json; charset=utf-8",
									error: function(xhr, type, errorThrown) {
										console.log(errorThrown);
										mui.toast('YouXiangYanZheng接口连接失败');
										//mui('.password_getcode')[0].removeAttribute('disabled');
									},
									success: function(data) { //回调函数，result，返回值
										if (data.code == 1) {
											mui.toast('验证码发送成功');
										} else {
											$('.ym').attr("disabled", false)
											mui.toast('验证码发送失败');
										}
									}
								})
							} else {
								mui.toast(data.message);
							}
						},
						error: function(XMLHttpRequest, textStatus, errorThrown) {
							$('.ym').attr("disabled", false)
							mui.toast("CheckYouXiang连接失败");
						}
					})
				})
			});
		</script>
	</body>
</html>
